/*\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\
Filename : exploding-chickens/public/css/game.css
Desc     : css file for game assets
\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\*/

.bottom-card {
    width: 12.75rem;
    height: 18rem;
    border-radius: 2rem;
}
.center-card {
    width: 10.2rem;
    height: 14.4rem;
    border-radius: 1.6rem;
}
.tooltip-card {
    /*width: 10.2rem;*/
    background: hsla(var(--n) / var(--tw-border-opacity));
    color: #ffffff;
    text-align: center;
    padding: 4px 10px 5px 10px;
    border-radius: 10px;
    top: calc(100% + 11px);
    left: 50%;
    transform: translate-x(-50%);
    font-size: 14px;
}
@media (min-width: 640px) {
    .center-card {
        width: 12.75rem;
        height: 18rem;
        border-radius: 2rem;
    }
    .tooltip-card {
        /*width: 12.75rem;*/
        background: hsla(var(--n) / var(--tw-border-opacity));
        color: #ffffff;
        text-align: center;
        padding: 4px 10px 5px 10px;
        border-radius: 10px;
        top: calc(100% + 11px);
        left: 50%;
        transform: translate-x(-50%);
        font-size: 14px;
    }
}
.center-card-text {
    height: 14.4rem;
}
@media (min-width: 640px) {
    .center-card-text {
        height: 18rem;
    }
}
.tooltip-box {
    position: relative;
    padding-top: 6px;
}
.triangle {
    border-width: 0 6px 6px;
    border-color: transparent;
    border-bottom-color: hsla(var(--n) / var(--tw-border-opacity));
    position: absolute;
    top: 0;
    left: 48%;
    transform: translate-x(-50%)
}